<!DOCTYPE html>
<html lang="en" class="no-js">

	<head>
		<title>一只慢乌龟的TimeTown</title>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<link rel="icon" href="/TYdeTimetown/images/title.ico"/>
		<link rel="stylesheet" href="css/footer.css" />
		<link rel="stylesheet" href="css/motto.css" />
		<link rel="stylesheet" href="css/font_import.css" />
		<!--
        	作者：TY
        	时间：2018-05-30
        	描述：bootstrap插件
        -->
		<link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
		<script src="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap-theme.min.css"></script>
		<script src="https://cdn.bootcss.com/jquery/2.1.1/jquery.min.js"></script>
		<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
		<!--end-->
		<link rel="stylesheet" href="css/home.css" type="text/css" />
		<!--
        	作者：TY
        	时间：2018-05-30
        	描述：遮盖式菜单样式表
        -->
		<link rel="stylesheet" href="css/menu_style.css" type="text/css" />
		<!--end-->
		<script src="js/modernizr.custom.js"></script>
	</head>

	<body>
		<!--遮盖式菜单-->
		<div class="overlay overlay-hugeinc">
			<button type="button" class="overlay-close">Close</button>
			<nav>
				<ul>
					<li>
						<a href="index.html" target="_self">Home</a>
					</li>
					<li>
						<a href="timeline.html" target="_self">TimeLine</a>
					</li>
					<li>
						<a href="collection.html" target="_self">My Collection</a>
					</li>
					<li>
						<a href="about_me.html" target="_self">About Me</a>
					</li>
				</ul>
			</nav>
		</div>
		<!--end-->
		<header>
			<div class="for-sticky">
				<div class="logo">
					<a href="index.html"><img alt="logo" class="logo-nav" src="images/title_simple.png"></a>
				</div>
			</div>
			<button class="menu-button" id="open-button">
        		<span></span>
        		<span></span>
        		<span></span>
      		</button>
		</header>
		<section class="content">
			<div class="imgback">
				<div class="intro_timeline">
					<h2>Hello</h2>
					<br>
					<span id="typed"></span>
				</div>
			</div>
			<button class="go_down" onclick="clicktest()">SEE MORE</button>
		</section>
		<section class="introduce">
			<div class="col-md-4">
				<h1 class="title_of_introduction">Introduction</h1>
				<p class="introduction_detail">Actually I wanna put some photos of my traveling here</p>
				<p class="introduction_detail">There is going to be the gallery of my most precious memory.And I don't know what I should put here,so I just say something useless to fill this area so that this area will not look that ugly.</p>
				<p class="introduction_detail">and pictures on the right is also what I found on the Internet and put them here just for now</p>
			</div>
			<div class="col-md-8 img_ul_homepage">
				<ul class="introduce_ul">
					<div class="row">
						<li class="col-md-6">
							<img alt="images1" src="images/pic_30_meitu_14.jpg" />
						</li>
						<li class="col-md-6">
							<img alt="images1" src="images/pic_32_meitu_15.jpg" />
						</li>
					</div>
					<div class="row">
						<li class="col-md-6">
							<img alt="images1" src="images/pic_33_meitu_16.jpg" />
						</li>
						<li class="col-md-6">
							<img alt="images1" src="images/pic_34_meitu_17.jpg" />
						</li>
					</div>
				</ul>
			</div>
		</section>
		<section class="motto">
			<div class="content-motto">
				<h3 class="words">
                       	Walk outside, and you will see the different color of the world~
                </h3>
				<p class="people">
					——T.Y.
				</p>
			</div>
			<div class="darken_background"></div>
		</section>
		<footer>
			<img src="images/logo_meitu_1.png" alt="myLogo" />
			<p class="footer_words">connect with me: 1234567890</p>
		</footer>

		<!--
        	作者：TY
        	时间：2018-05-30
        	描述：打印机效果
        -->
		<script src="https://cdn.bootcss.com/typed.js/2.0.5/typed.js"></script>
		<script>
			var boxObj2 = document.getElementById('typed');
			new Typed(boxObj2, {
				strings: ['This is my TimeTown', 'please use Chrome or Firefox', 'to see the best effect'],
				typeSpeed: 50,
				startDelay: 200,
				loop: true,
				loopCount: Infinity,
				cursorChar: ''
			});
		</script>
		<!--end-->
		<!--
        	作者：TY
        	时间：2018-05-31
        	描述：打开菜单
        -->
		<script src="js/classie.js"></script>
		<script src="js/menu.js"></script>

		<!--end-->
		<!--
        	作者：TY
        	时间：2018-06-01
        	描述：点击see more按钮的滑动效果
        -->
		<script>
			$(document).ready(function() {
				$(".go_down").click(function() {
					$("html, body").animate({
						scrollTop: $(".introduce").offset().top
					}, {
						duration: 500,
						easing: "swing"
					});
					return false;
				});
			})
		</script>
	</body>

</html>